<template>
  <div>
    <h2>{{ ta('welcome') }}</h2>
    <el-select v-model="locale">
      <el-option label="中文" value="zh" />
      <el-option label="英文" value="en" />
    </el-select>

    <svg-icon icon-class="fullscreen" style="color:pink; width: 20px; height: 20px" @click="changeScreen" />
  </div>
</template>

<script>
import ScreenFull from 'screenfull'
// import Vuei18n from 'vue-i18n'
export default {
  data() {
    return {
      locale: 'zh',

      message: {
        zh: {
          welcome: '欢迎光临'
        },
        en: {
          welcome: 'welcome back'
        }
      }
    }
  },
  created() {
    // console.log(this.$t)
    // console.dir(Vuei18n)
  },
  methods: {
    ta(str) {
      const dict = this.message[this.locale]
      const res = dict[str]
      return res
    },
    changeScreen() {
      ScreenFull.toggle()
    }
  }
}
</script>

<style>

</style>
